<template>
  <div class="layout-container page-404">

    <div class="theme-container">
      <div class="theme-default-content">
        <svg xmlns="http://www.w3.org/2000/svg" width="195" height="206.454">
          <defs><style>.f,.h{isolation:isolate}.b{fill:#1d1d1d}.c{fill:#1051f5}.g,.h{fill:#e5e8ee}
          .f{fill:#fff;opacity:.22}.h{opacity:.9}</style></defs>
          <path d="M-500.732 2853.457c23.118-.786 67.161-4.216 70.493-6.261s-34.046-2.717-57.161-1.932-78.262
          5.094-81.594 7.142 45.147 1.837 68.262 1.051z" transform="translate(595.527 -2647.565)"
            style="isolation:isolate;fill:#d1d1d1;opacity:.4"/>
          <path class="b" d="M42.719 96.199c2.83-.05 6.96-.09 12.05-.1v3c-5.07.01-9.17.05-11.99.1-24.37.49-40.27
          7.31-40.43 7.38a1.566 1.566 0 0 1-.6.12 1.475 1.475 0 0 1-1.37-.9 1.484 1.484 0 0 1 .77-1.97c.66-.294
          16.56-7.13 41.57-7.63zM194.909 98.335a1.505 1.505 0 0 1-1.55 1.45c-.16-.01-16.14-.55-34.79-.6-1.78-.01-3
          .02-4.24.05s-2.52.07-4.38.06q-3.615-.015-7.37-.02v-3q3.75 0 7.37.02c1.83.01 3.08-.03 4.31-.06 1.26-.03
          2.51-.05 4.32-.05 18.7.05 34.73.59 34.89.6a1.5 1.5 0 0 1 1.44 1.55zM184 147.202H11a1.5 1.5 0 0 1-1.5-1.5
          1.5 1.5 0 0 1 1.5-1.5h173a1.5 1.5 0 0 1 1.5 1.5 1.5 1.5 0 0 1-1.5 1.5zM193.5 51.202H1.5a1.5 1.5 0 0
          1-1.5-1.5 1.5 1.5 0 0 1 1.5-1.5h192a1.5 1.5 0 0 1 1.5 1.5 1.5 1.5 0 0 1-1.5 1.5z"/>
          <path class="c" d="M151.839 156.909c-4.43 11.09-15.14 18.92-26.22 19.84s-20.16-6.16-18.08-16.14 26.8-8.25
          32.64-23.8c3.49-9.32 4.01-16.14.64-19.52a6.627 6.627 0 0 0-2-1.28 49.43 49.43 0 0 0 2.68-4.41c8.53 3.96
          4.27 14.32 8.32 21.56 4.14 7.43 6.46 12.66 2.02 23.75z"/>
          <ellipse cx=".754" cy="1.377" rx=".754" ry="1.377" transform="rotate(-19.01 522.745 -333.538)"
                   style="opacity:.63;fill:#e5e8ee;isolation:isolate"/>
          <path class="b" d="M43.252 177.701h-.089a1.5 1.5 0 0 1-1.41-1.584 79.261 79.261 0 0 1 14.03-38.038 128.01
          128.01 0 0 1 11.309-13c7.475-7.858 13.931-14.643 11.593-19.958a1.5 1.5 0 0 1 .77-1.977 1.5 1.5 0 0 1
          1.977.769c3.142 7.144-3.953 14.6-12.167 23.233a126.267 126.267 0 0 0-11.049 12.689c-12.186 16.91-13.457
          36.265-13.468 36.459a1.5 1.5 0 0 1-1.496 1.407z"/>
          <path class="b" d="M61.696 135.88c3.205 1.262 18.915-3.989
          18.915-3.989s-8.093-6.045-12.82-5.045-9.3 7.772-6.095 9.034z"/>
          <path class="b" d="M50.113 132.735c1.591 3.056 16.9 9.4 16.9 9.4s-2.141-9.874-6.365-12.222-12.126-.234-10.535
          2.822z"/>
          <path class="c" d="M159.979 103.059c-1.07.87-11.17 6.15-17.41 6.53.14-.28.29-.56.43-.84a24.4 24.4 0 0 0
          2.34-12.03c.21-.13.32-.2.32-.2s10.68 4.98 11.12 1.37 3.48-4.42 4.21-3.06.15 7.28-1.01 8.23zM50.779
          96.019c-.08.14-.17.29-.26.44-1.72 2.88-3.38 5.65-4.87 8.3-5.31-1.73-11.4-3.3-13.24-2.55-2.96
          1.19-4.71-.61-3.79-1.82s7.43-3.37 7.43-3.37 9.77-2.45 14.73-1z"/>
          <path class="b" d="M161.179 99.202h-6.63c-.828 0 1.876-3.013 2.7-3.013l4.024.011c.832 0 .734 3.002-.094
          3.002zM144.346 95.209c16.806-12.241 30.33-28.168 30.543-28.421a1.5 1.5 0 0 1 2.113-.182 1.5 1.5 0 0 1
          .182 2.114c-.891 1.059-14.614 17.216-31.8 29.509zM149.902 166.089a9.116 9.116 0 0 1-7.67 4.44 6.34 6.34 0
          0 1-.87-.05 32.035 32.035 0 0 0 5.21-4.94c.06-.06.11-.12.16-.18a7.723 7.723 0 0 0 .62-.85c1.05-1.69
          3.76-8-5.31-18.32a394.524 394.524 0 0 0-18.756-19.849l2.9-1.348a393.011 393.011 0 0 1 18.1 19.217c10.441
          11.88 6.941 19.75 5.616 21.88zM65.852 76.967C48.919 59.536 37.486 30.898 30.109 5.349a1.5 1.5 0 0 1
          1.02-1.86 1.5 1.5 0 0 1 1.86 1.02c7.217 25.014 18.355 53.077 34.683 70.052.71.738-.527 3.738-1.82
          2.406zM162.219 4.449c-.884 2.78-17.255 53.7-39.8 77.119-2.44 2.535-3.882-.2-2.109-2.054 22.037-23.014
          38.842-75.3 39.054-75.975a1.5 1.5 0 0 1 1.88-.98 1.509 1.509 0 0 1 .975 1.89z"/>
          <path d="M-452.283 2730.917c-.748-1.587-4.94-3.749-6.288-3.631s-1.867 2.51.9 4.1-1.372 8.341-1.372
          8.341-22.964-26.913-46.573-25.333a51.267 51.267 0 0 0-16.011
          3.351c-4.416-4.377-11.183-7.714-12.067-7.641-1.2.1-5.188 4.426-5.517 5.917s2.023 2.386 4.2.051c1.415-1.518
          3.263 2.412 5.731 5.987-6.885 5.167-11.479 12.682-17.019 21.965-10.126 16.969-18.3 30.093.174
          38.247s27.678-13.979 42.127-12.806c11.236.6 15.854 7.6 28.827 6.7 13.573-.86
          18.528-6.422 24.252-17.736s-.616-25.929-1.364-27.512z" transform="translate(595.527 -2647.565)"
                style="fill:#48f"/>
          <path class="f" d="M136.473 92.153c-2.178 3.245-10.119 8.747-12.254 8.933s3.524-5.092
          4.427-9.386-.54-5.8-.626-7.892v-.031a93.339 93.339 0 0 1 8.453 8.376zm.2-.316.177-.306z"/>
          <path class="b" d="M45.627 117.749c.4-.672-7.108-4.678-14.58-5.267-6.162-.483 3.3.873 6.176 1.9s8.004
          4.039 8.404 3.367zM56.435 123.344c.417-.664 11.1 6.474 17.939 14.645 5.63
          6.739-3.7-3.414-7.232-6.307s-11.125-7.674-10.707-8.338zM46.006
          116.245c1.435.688.031-1.034-4.323-4.838-3.587-3.134-7.038-6.338-5.958-5.129s8.846 9.279 10.281 9.967zM57.8
          121.813c-2.747-1.356 1.265-.7 11.777 2.3 8.665 2.48 17.228 4.735 14.284 4.16s-23.311-5.109-26.061-6.46z"/>
          <path class="g" d="M52.015 119.054c1.577.579 3.831 3.033 2.162
          1.592s-2.55-.146-2.671.348c-.123.554.543.944.181 1.538s-2.67-.643-2.348-1.3.931-.307 1.376-.714a1.226
          1.226 0 0 0 .324-1.7 1.224 1.224 0 0 0-.434-.39c-1.198-.924-.592-.643 1.41.626z"/>
          <path class="g" d="M51.686 118.357c.347.349.547.607.874.642a2.058 2.058 0 0 1 1.2.287 2.359 2.359 0 0
          1 1.367 2.184c-.166.3-.849-1.035-1.733-1.525a2.8 2.8 0 0
          0-.563-.21l-.19-.058-.649-.1-.132.085-.06.045-.168-.192h-.039l.011-.021-.472-.521a3.571 3.571 0 0
          0-1-.834c-1.155-.641-1.969-.135-1.8-.435a1.61 1.61 0 0 1 2.165-.221l.1.056a4.823 4.823 0 0 1 1.089.818z"/>
          <circle class="g" cx="4.408" cy="4.408" r="4.408" transform="translate(37.925 121.453)"/>
          <circle class="g" cx="4.408" cy="4.408" r="4.408" transform="translate(47.171 125.354)"/>
          <path class="f" d="M120.349 162.555c-.682-.12-1.374.572-1.546 1.547s.242 1.862.924 1.983 1.374-.573
          1.546-1.547-.246-1.863-.924-1.983zM137.11 165.654c-.968-.371-1.954-.148-2.2.5s.335 1.472 1.3 1.844
          1.953.148 2.2-.5-.332-1.472-1.3-1.844zM103.868 96.258a.631.631 0 0 0-.17.877.632.632 0 0 0 .877.171.634.634
          0 0 0 .171-.878.632.632 0 0 0-.878-.17zM105.478 115.872a.631.631 0 0 0-.17.877.632.632 0 0 0
          .877.171.634.634 0 0 0 .171-.878.633.633 0 0 0-.878-.17zM80.364 77.423a.631.631 0 0 0-.17.877.632.632 0 0
          0 .877.171.633.633 0 0 0 .171-.878.632.632 0 0 0-.878-.17zM58.183 95.746a.632.632 0 0 0-.864.231.632.632 0
          0 0 .232.863.632.632 0 0 0 .863-.231.631.631 0 0 0-.231-.863zM50.093 109.759a.632.632 0 0 0-.864.231.632.632
          0 0 0 .232.863.631.631 0 0 0 .863-.231.632.632 0 0 0-.231-.863zM68.164 97.924a.633.633 0 0 0-.349.823.631.631
          0 0 0 .823.349.63.63 0 0 0 .349-.822.633.633 0 0 0-.823-.35zM105.688 79.949a.631.631 0 0 0 .349-.822.633.633
          0 0 0-.823-.35.633.633 0 0 0-.349.823.631.631 0 0 0 .823.349z"/>
          <path class="h" d="M85.027 102.02a1.216 1.216 0 0 0-.328 1.689 1.216 1.216 0 0 0 1.689.329 1.218 1.218 0 0
          0 .328-1.69 1.216 1.216 0 0 0-1.689-.328zM128.127 115.676a.632.632 0 0 0-.878-.17.631.631 0 0
          0-.17.877.632.632 0 0 0 .877.171.633.633 0 0 0 .171-.878zM70.227 109.684a.633.633 0 0 0-.349.823.632.632
          0 0 0 .823.349.63.63 0 0 0 .349-.822.633.633 0 0 0-.823-.35z"/>
          <circle class="b" cx="1.441" cy="1.441" r="1.441" transform="translate(38.493 123.804)"/>
          <circle class="b" cx="1.441" cy="1.441" r="1.441" transform="translate(47.761 125.455)"/>
          <path class="b" d="M42.627 135.402h-.008a10.452 10.452 0 0 1-5.259-1.53.5.5 0 0 1-.166-.687.5.5 0 0 1
          .687-.166 9.451 9.451 0 0 0 4.755 1.383.5.5 0 0 1 .491.508.5.5 0 0 1-.5.492zM52.445 138.895a10.446 10.446
          0 0 1-3.813-.721.5.5 0 0 1-.283-.648.5.5 0 0 1 .648-.283 9.425 9.425 0 0 0 4.922.536.5.5 0 0 1 .573.416.5.5
          0 0 1-.415.572 10.413 10.413 0 0 1-1.632.128z"/>
          <path class="c" d="M1.989 88.498a12.736 12.736 0 0 0 3.223 5.428 12.8 12.8 0 0 0-3.464-11.739 12.756
          12.756 0 0 0 .241 6.311z"/>
          <path class="b" d="M6.849 84.076a20.132 20.132 0 0 0-1.643 9.849 20.242 20.242 0 0 0 7.79-17.723 20.178
          20.178 0 0 0-6.147 7.874zM102.681 124.735a16.586 16.586 0 0 1-5.01.69 23.927 23.927 0 0
          1-12.75-3.75c-5.57-3.55-12.37-11.28-13.12-27.91-1.4-30.71 20.17-90.26 21.08-92.78a1.513 1.513 0 0 1
          1.93-.9 1.5 1.5 0 0 1 .89 1.93c-.22.61-22.28 61.5-20.91 91.61.55 12.15 4.61 20.97 11.74 25.52a20.986 20.986
          0 0 0 7.52 2.93l.42.14a36.369 36.369 0 0 1 8.21 2.52z"/>
          <path d="M-457.64 2820.342a29.754 29.754 0 0 1-12.26 3.938c-6.2.519-11.928-1.461-15.325-5.3a12 12 0 0
          1-2.645-4.862 12.756 12.756 0 0 1-.112-5.962 7.507 7.507 0 0 1 3.18-4.491 8.088 8.088 0 0 0-.407 1.357 11.2
          11.2 0 0 0 2.8 10.012c3.865 4.365 10.739 6.817 17.513 6.249a29 29 0 0 0 10.2-2.851 32.787 32.787 0 0 1-2.944
          1.91z" transform="translate(595.527 -2647.565)" style="fill:#6da2ff"/>
          <path class="b" d="M130.306 182.459a1.5 1.5 0 0 1-1.38.92 1.505 1.505 0 0 1-.58-.12 1.5 1.5 0 0
          1-.8-1.97c4.21-9.97 1.72-19.1-2.02-24.31-2.13-2.97-4.78-4.79-6.73-4.66a3.126 3.126 0 0
          0-1.33.36c-.01.01-.03.01-.04.02a37.69 37.69 0 0 0-4.92 2.26l.06-.24c1.1-3.38 3.12-5.2 6.01-5.39 3.07-.21
          6.58 1.98 9.39 5.9 4.21 5.88 7.04 16.12 2.34 27.23z"/>
        </svg>
        <h1>Page not found (404)</h1>
        <a :href="homeUrl">&larrhk; Go back to the documentation</a>
      </div>
    </div>

  </div>
</template>

<script>
const frameworkRegExp = new RegExp('^/docs/((next|\\d+.\\d+)/)?(?<framework>react|javascript)-data-grid/.*');

export default {
  data() {
    return {
      homeUrl: '/'
    };
  },
  methods: {
    /**
     * Returns the new homepage URL of the previously selected framework. For example for
     * `/docs/10.1/react-data-grid/foo/bar` it's `/docs/react-data-grid/`.
     *
     * The $page object is not available within the component so read the state from
     * the "window.location".
     *
     * @returns {string}
     */
    getFrameworkHomePage() {
      const {
        framework,
      } = window.location.pathname.match(frameworkRegExp)?.groups ?? {
        framework: 'javascript'
      };

      return `/docs/${framework}-data-grid/`;
    }
  },
  mounted() {
    this.homeUrl = this.getFrameworkHomePage();
  },
  created() {
    if (this.$ssrContext) {
      this.$ssrContext.docsGenStamp = '';
    }
  }
};
</script>

<style lang="stylus">
.page-404 {
  text-align: center;

  h1 {
    margin-top: 60px!important;
  }
}
</style>
